
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>API</title>

    <link rel="stylesheet" href="../css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/bootstrap-combined.min.css">
    <link rel="stylesheet" href="../css/bootstrapEx.css">


    <script src="../js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../js/bootstrap.min.js"></script>
</head>

<body>
    <div class="container-fluid">
       <div id="topnavbar" bsexid="bsex1">
        <nav class="navbar navbar-default">
        <div class="container-fluid"></div>
        <div class="navbar-header"><button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bsex1" aria-expanded="false" aria-controls="navbar"><span class="sr-only"></span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button>
            <a class="navbar-brand" href="#">JQ-Bootstrap扩展</a>
        </div>
        </nav>
        </div>
        <div class="row-fluid">
            <div class="">
                <div class="span2 leftmenu" id="menu1">
                    <ul class="widget widget-menu unstyled">
                        <li class="ultitle" data-toggle="collapse" data-target=".sonli">
                            <span>API</span>
                        </li>
                        <li class="active sonli collapse in">
                            <a href="#" data-url="base.html">基础通用</a>
                        </li>
                        <li class="sonli collapse in">
                            <a href="#" data-url="modal.html">Modal遮罩层</a>
                        </li>
                        <li class="sonli collapse in">
                            <a href="#" data-url="alert.html">Alert提示框</a>
                        </li>
                        <li class="sonli collapse in">
                            <a href="#" data-url="confirm.html">Confirm确认框</a>
                        </li>
                        <li class="sonli collapse in">
                            <a href="#" data-url="tab.html">Tab页签</a>
                        </li>
                        <li class="sonli collapse in">
                            <a href="#" data-url="itemform.html">表单</a>
                        </li>
                        <li class="sonli collapse in">
                            <a href="#" data-url="dropdownlist.html">下拉控件</a>
                        </li>
                        <li class="sonli collapse in">
                            <a href="#" data-url="panel.html">Panel面板</a>
                        </li>
                        <li class="sonli collapse in">
                            <a href="#" data-url="tree.html">Tree树</a>
                        </li>
                        <li class="sonli collapse in">
                            <a href="#" data-url="button.html">Button按钮</a>
                        </li>
                        <li class="sonli collapse in">
                            <a href="#" data-url="grid.html">Grid表格</a>
                        </li>
                    </ul>
                </div>
                <div class="span10">
                    <div class="" id="tabs-727463">
                        <iframe id="if-main" src="base.html" style="min-height: 285px;" width="100%" height="100%" frameborder="0"></iframe>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script>
    $(document).ready(function () {

         //控制iframe大小
         var ifmainsize = function(){
            var fheight = $('#footer').parent().height();
            var iftop =  $('#if-main').offset().top;
            $('#if-main').css('min-height', $(window).height() - fheight - iftop - 10);
        }
        setTimeout(function () {
            ifmainsize();
        }, 0);
        
        var winresizeend=function(fun,args){
            var rtime = new Date(1, 1, 2000, 12,00,00);
            var timeout = false;
            var delta = 200;
            args = args||[];
            $(window).resize(function() {
                rtime = new Date();
                if (timeout === false) {
                    timeout = true;
                    setTimeout(resizeend, delta);
                }
            });
    
            function resizeend() {
                if (new Date() - rtime < delta) {
                    setTimeout(resizeend, delta);
                } else {
                    timeout = false;
                    fun();
                }
            }
        };

        winresizeend(ifmainsize);


        $("#menu1").find('a[data-url]').on('click',function(){
            $('#menu1').find("li").removeClass("active");
            $('#if-main').attr("src",$(this).attr("data-url"));
            $(this).parent().addClass("active");

            if(isMobile()){
                $('.sonli').collapse('hide');
            }
        });


        var isMobile = function(){
            if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
                return true;
            }
            return false;
        }

        //隐藏和关闭菜单的事件 重置 页面大小
        $('.sonli').on('hidden.bs.collapse', function () {
            ifmainsize();
        }).on('shown.bs.collapse', function () {
            ifmainsize();
        })
    });
</script>

<script type="text/javascript">// <![CDATA[
    window.tctipConfig = {
        staticPrefix: "http://static.tctip.com",
        buttonImageId: 3,
        buttonTip: "zanzhu",
        list:{
          alipay: {qrimg: "http://140.143.155.224:8083/zfb20.png"},
          weixin:{qrimg: "http://140.143.155.224:8083/winxin20.png"},
        }
    };
    // ]]></script>
    <script type="text/javascript" src="http://static.tctip.com/js/tctip.min.js"></script>
    
</html>